<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    .kuang {
        width: 174px;
    }
</style>
<script src="../static/global.js"></script>
<body>
<!--优惠卷的添加-->
<div>
    <form style="margin-top: 20px;margin-left: 30px" id="couponAddForm" lay-filter="couponAddForm"
          class="layui-form layui-form-pane" action="">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">优惠卷选择类型</label>
                <div class="layui-inline kuang">
                    <select name="coupon_type" lay-filter="coupon_type">
                        <option value="">请选择</option>
                        <option value="0">全场赠券</option>
                        <option value="1">会员赠券</option>
                        <option value="2">购物赠券</option>
                        <option value="3">注册赠券</option>
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <label class="layui-form-label">发布状态</label>
                <div class="layui-inline kuang">
                    <select name="publish" lay-filter="publish">
                        <option value="">请选择</option>
                        <option value="0">未发布</option>
                        <option value="1">已发布</option>
                    </select>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">优惠卷名字</label>
                <div class="layui-input-block">
                    <input type="text" name="coupon_name" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">数量</label>
                <div class="layui-input-inline">
                    <input type="number" name="num"  min="0"  step="1" autocomplete="off" class="layui-input" data-prec="4">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">金额</label>
                <div class="layui-input-block">
                    <input class="layui-input layui-input-number" name="amount" id="amount" min="0" max="100" step="1" data-prec="2">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">限领张数</label>
                <div class="layui-input-inline">
                    <input type="number" name="per_limit" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">使用类型</label>
                <div class="layui-inline kuang">
                    <select name="use_type" lay-filter="use_type ">
                        <option value="">请选择</option>
                        <option value="0">全场通用</option>
                        <option value="1">指定分类</option>
                        <option value="2">指定商品</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">使用门槛</label>
                <div class="layui-input-block">
                        <input class="layui-input layui-input-number" name="min_point" id="min_point" min="0" max="100" step="1" data-prec="4">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">开始时间</label>
                <div class="layui-input-block">
                    <input type="text" name="start_time" id="start_time" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">结束时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="end_time" id="end_time" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">领取会员等级</label>
                <div class="layui-inline kuang">
                    <select name="member_level" lay-filter="member_level">
                        <option value="">请选择</option>
                        <option value="0">不限等级</option>
                        <option value="1">对应等级</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">发行数量</label>
                <div class="layui-input-inline">
                    <input type="number" name="publish_count" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

<!--        <div class="layui-form-item">-->
<!--            <div class="layui-inline">-->
<!--                <label class="layui-form-label">已使用数量</label>-->
<!--                <div class="layui-input-block">-->
<!--                    <input type="number" name="use_count" autocomplete="off" class="layui-input">-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="layui-inline">-->
<!--                <label class="layui-form-label">领取数量</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="number" name="receive_count" autocomplete="off" class="layui-input">-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">领取开始日期</label>
                <div class="layui-input-block">
                    <input type="text" name="enable_start_time" id="enable_start_time" autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">领取结束日期</label>
                <div class="layui-input-inline">
                    <input type="text" name="enable_end_time" id="enable_end_time" autocomplete="off"
                           class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-inline">
            <div class="layui-inline">
                <label class="layui-form-label">优惠卷图片</label>
                <div class="layui-input-inline">
                    <div class="layui-upload">
                        <img style="width: 80px;height: 80px" class="layui-upload-img" id="demo1">
                        <button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
                        <button type="button" class="layui-btn" id="test9">开始上传</button>
                    </div>
                    <input type="text" name="coupon_img" id="coupon_img_add" autocomplete="off"
                           class="layui-input layui-hide">
                </div>
            </div>
            <!--            <div class="layui-inline">-->
            <!--                <label class="layui-form-label">优惠码</label>-->
            <!--                <div class="layui-input-block">-->
            <!--                    <input type="text" name="code"  autocomplete="off" class="layui-input">-->
            <!--                </div>-->
            <!--            </div>-->
        </div>

        <div style="margin-top: 25px" class="layui-form-item layui-form-text">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea name="note" autocomplete="off" placeholder="请输入内容备注" class="layui-textarea"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="button" class="layui-btn" id="" lay-submit="couponAdd" lay-filter="couponAdd">立即提交
                </button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>

<script>

    layui.config({
        base: '../static/modules/'
    }).extend({
        numinput: 'numinput/numinput'
    }).use(['form', 'layer', 'laydate', 'upload','numinput'], function () {
        let $ = layui.$;
        let layer = layui.layer;
        let form = layui.form;
        let laydate = layui.laydate;
        let upload = layui.upload;
        let numinput = layui.numinput;

        numinput.init({
            // 123：123键置顶, 789：789键置顶
            topBtns: 123,
            // 右侧功能按钮
            rightBtns: true,
            // 监听键盘事件
            listening: true,
            // 批量配置默认小数精确度
            // defaultPrec: ''
        });





        //选完文件后不自动上传
        upload.render({
            elem: '#test8'
            , url: glodate.serverZuul + 'brand/filesUploadLayui'//我的上传接口 //改成您自己的上传接口
            , auto: false
            , bindAction: '#test9'
            , choose: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                    $("#demo1").removeClass("layui-hide");
                });
            }
            , done: function (res, index, upload) {
                console.log(res);
                //假设code=0代表上传成功
                if (res.code == 0) {
                    $("#coupon_img_add").val(res.data);

                    //do something （比如将res返回的图片链接保存到表单的隐藏域）
                    layer.msg(res.msg, {icon: 1});
                }
            }, error: function (index, upload) {
                //当上传失败时，你可以生成一个“重新上传”的按钮，点击该按钮时，执行 upload() 方法即可实现重新上传
            }
        });


        form.on('submit(couponAdd)', function () {
            let data = form.val('couponAddForm');
            console.log(data);
            $.ajax({
                url: glodate.serverZuul + "coupon/insert_admin_coupon_All",
                type: "post",
                dataType: "json",
                data: data,
                success: function (res) {
                    console.log(res);
                    if (res.code == 200) {
                        layer.msg("添加成功", {icon: 6});
                    } else {
                        layer.msg(res.msg, {icon: 5});
                    }
                    location.reload();
                }
            })
            return false;
            layer.closeAll();

        })


        //将日期直接嵌套在指定容器中
        laydate.render({
            elem: '#start_time'
            , type: 'datetime'
            , trigger: 'click'
            ,min: 0
            ,max: 7
            ,theme: 'molv'
        });
        laydate.render({
            elem: '#end_time'
            , type: 'datetime'
            , trigger: 'click'
            ,min: 0
            ,max: 7
            ,theme: 'molv'
        });
        laydate.render({
            elem: '#enable_start_time'
            , type: 'datetime'
            , trigger: 'click'
            ,min: 0
            ,max: 7
            ,theme: 'molv'
        });
        laydate.render({
            elem: '#enable_end_time'
            , type: 'datetime'
            , trigger: 'click'
            ,min: 0
            ,max: 7
            ,theme: 'molv'
        });


    })
</script>
</body>
</html>